<script setup>
</script>

<template>
  <router-view></router-view>
</template>

<style>
html,
body,
#app {
  height: 100%;
}
body {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background-image: url('./img/bj.jpg');
  background-size: cover;
}
.box {
  width: 90%;
  height: 80%;
  transform: translateX(5%) translateY(10%);
  box-shadow: 1px 2rem 4rem #23d5ab;
  border-radius: 1rem;
  border: 0.1rem rgba(255, 255, 255, 0.543) solid;
  background-color: rgba(6, 68, 68, 0.539);
  backdrop-filter: blur(3px);
  animation: gradientBG 4s linear infinite alternate;
}
@keyframes gradientBG {
  0% {
    box-shadow: 1px 2rem 5rem #b12d05;
  }
  50% {
    box-shadow: 1px 2rem 1rem #ffffff69;
  }
  100% {
    box-shadow: 1px 2rem 5rem #02668a;
  }
}
</style>
